<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
	xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">

<head data-n-head="">
<title data-n-head="true">闲渔二手商城</title>
<!-- 客服meta -->
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="viewport"
	content="width=device-width,initial-scale=1.0,maximum-scale=1"/>
<meta name="keywords"
	content="pvr, pvr tech studio, css chat box, pvr admin, pvr tech admin" />
<meta name="description"
	content="PVR Tech Studio, We Design your Future."/>
<meta data-n-head="true" charset="utf-8">
<meta data-n-head="true" name="viewport"
	content="width=device-width, initial-scale=1, user-scalable=no"/>
<meta data-n-head="true" data-hid="description" name="description"
	content="闲渔优品"/>

<link type="text/css" rel="stylesheet"
	href="css/common/bootstrap.min.css" />

<!-- Slick -->
<link type="text/css" rel="stylesheet" href="css/index/slick.css" />
<link type="text/css" rel="stylesheet" href="css/index/slick-theme.css" />

<!-- nouislider -->
<link type="text/css" rel="stylesheet"
	href="css/index/nouislider.min.css" />

<!-- Font Awesome Icon -->
<link rel="stylesheet" href="fonts/index/font-awesome.min.css"/>

<!-- Custom stlylesheet -->
<link type="text/css" rel="stylesheet" href="css/index/style.css" />
<!-- 河豚图标字体 -->
<link rel="stylesheet" href="./fonts/index/font_hetun/iconfont.css"/>
<!-- 客服link -->
<link rel="icon" th:href="@{/assets/img/favicon/favicon-32x32.png}"/>
<link href='http://fonts.googleapis.com/css?family=Montserrat:400,700'
	rel='stylesheet' type='text/css'/>

<!-- ***** Boostrap Custom / Addons Stylesheets ***** -->
<link th:href="@{/assets/plugins/bootstrap/css/bootstrap.min.css}"
	rel="stylesheet" />
<link th:href="@{/assets/plugins/material_icon/icon.css}" rel="stylesheet" />

<!-- Required CSS file for CSS Chat Panels element -->
<link
	th:href="@{/assets/plugins/perfect-scrollbar/css/perfect-scrollbar.min.css}"
	rel="stylesheet" />
<link rel="stylesheet" th:href="@{/assets/css/chat_box.css}" type="text/css"
	media="all">
<script type="text/javascript" th:src="@{/js/common/jquery-3.5.1.min.js}"></script>
<script th:src="@{/assets/plugins/jquery/jquery-3.2.1.min.js}"
	type="text/javascript"></script>
<script
	th:src="@{/assets/plugins/perfect-scrollbar/js/perfect-scrollbar.jquery.min.js}"
	type="text/javascript"></script>
<script th:src="@{/assets/plugins/backstretch/backstretch.js}"
	type="text/javascript"></script>
<script th:src="@{/assets/js/app.js}"></script>
<!-- 网站原有的样式 -->
<style
	data-vue-ssr-id="a8abe242:0 03b6f4a5:0 39c0e750:0 67f22e2c:0 5138e17d:0 0966eac4:0 782fc0e6:0">
article, aside, blockquote, body, button, code, dd, details, div, dl, dt,
	fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6,
	header, hgroup, hr, input, legend, li, menu, nav, ol, p, pre, section,
	td, textarea, th, ul {
	margin: 0;
	padding: 0
}

body {
	font: 12px/1.5 Helvetica Neue, Helvetica, Tahoma, Arial, PingFang SC,
		Hiragino Sans GB, Heiti SC, Microsoft YaHei, WenQuanYi Micro Hei,
		sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background: #fff
}

input, select, textarea {
	font-size: 100%
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

li, ol, ul {
	list-style: none
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 400
}

em, i {
	font-style: normal
}

fieldset, img {
	border: 0
}

a {
	color: inherit;
	text-decoration: none
}
	/* 给所有的a标签设置小手 */
		a{
			cursor:pointer;
		}
button {
	outline: none;
	border: none
}

div, form, h2, h3, h4, html, li, p, span, ul {
	word-wrap: break-word;
	word-break: break-all
}

.nuxt-progress {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	width: 0;
	opacity: 1;
	transition: width .1s, opacity .4s;
	background-color: #108ee9;
	z-index: 999999
}

.nuxt-progress.nuxt-progress-notransition {
	transition: none
}

.nuxt-progress-failed {
	background-color: red
}

.main[data-v-fdc68faa] {
	background-color: #f4f5f5
}

.open-alert[data-v-2a3350d2] {
	position: fixed;
	top: 77px;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0
}

.open-alert-mask[data-v-2a3350d2] {
	width: 100%;
	height: 100%;
	z-index: 9999;
	background-color: rgba(0, 0, 0, .6);
	display: flex;
	justify-content: center
}

.open-alert-mask .alert-container[data-v-2a3350d2] {
	margin-top: 80px;
	width: 471px;
	height: 428px;
	background-color: #fff;
	display: flex;
	flex-direction: column
}

.open-alert-mask .alert-container .container-top[data-v-2a3350d2] {
	display: flex;
	justify-content: space-between
}

.open-alert-mask .alert-container .container-top .container-top-title[data-v-2a3350d2]
	{
	margin-top: 28px;
	margin-left: 32px;
	font-size: 18px;
	font-family: PingFangSC;
	font-weight: 500;
	color: #3c3c3c;
	line-height: 25px
}

.open-alert-mask .alert-container .container-top .container-top-fork[data-v-2a3350d2]
	{
	margin-top: 32px;
	margin-right: 30px;
	width: 14px;
	height: 14px;
	background-image:
		url(images/index/n_v21d3e1aaa24a5418fa515dc7eefb3143d.png);
	background-repeat: no-repeat;
	background-size: cover
}

.open-alert-mask .alert-container .borderLine[data-v-2a3350d2] {
	margin-top: 20px;
	border-bottom: 1px solid #c6c6c6
}

.open-alert-mask .alert-container .phoneNumber[data-v-2a3350d2] {
	margin-top: 64px;
	display: flex;
	flex-direction: row
}

.open-alert-mask .alert-container .phoneNumber .lable[data-v-2a3350d2] {
	margin-left: 33px;
	margin-top: 5px;
	font-size: 14px;
	font-family: PingFangSC;
	font-weight: 400;
	color: #3c3c3c;
	line-height: 29px
}

.open-alert-mask .alert-container .phoneNumber .phoneNumInput[data-v-2a3350d2]
	{
	width: 184px;
	height: 39px;
	margin-left: 2px;
	padding-left: 15px;
	font-size: 14px;
	font-family: PingFangSC;
	font-weight: 400;
	line-height: 32px;
	background: #f7f7f7;
	border-radius: 3px;
	border: 1px solid #e3e3e3
}

.open-alert-mask .alert-container .phoneNumber .smsNumBtn[data-v-2a3350d2]
	{
	background: #f55;
	border-radius: 3px;
	color: #fff
}

.open-alert-mask .alert-container .phoneNumber .countDownNumBtn[data-v-2a3350d2],
	.open-alert-mask .alert-container .phoneNumber .smsNumBtn[data-v-2a3350d2]
	{
	margin-left: 12px;
	width: 126px;
	height: 39px;
	font-size: 14px;
	text-align: center;
	font-family: PingFangSC;
	font-weight: 500;
	line-height: 39px
}

.open-alert-mask .alert-container .phoneNumber .countDownNumBtn[data-v-2a3350d2]
	{
	background: #f7f7f7;
	border-radius: 3px;
	color: #c6c6c6;
	border: 1px solid #e3e3e3
}

.open-alert-mask .alert-container .smsNumber[data-v-2a3350d2] {
	margin-top: 21px;
	display: flex;
	flex-direction: row
}

.open-alert-mask .alert-container .smsNumber .lable[data-v-2a3350d2] {
	margin-left: 33px;
	margin-top: 5px;
	font-size: 14px;
	font-family: PingFangSC;
	font-weight: 400;
	color: #3c3c3c;
	line-height: 29px
}

.open-alert-mask .alert-container .smsNumber .smsNumInput[data-v-2a3350d2]
	{
	width: 184px;
	height: 39px;
	margin-left: 2px;
	padding-left: 15px;
	font-size: 14px;
	font-family: PingFangSC;
	font-weight: 400;
	line-height: 32px;
	background: #f7f7f7;
	border-radius: 3px;
	border: 1px solid #e3e3e3
}

.open-alert-mask .alert-container .login[data-v-2a3350d2] {
	margin-top: 72px;
	margin-left: 144px;
	width: 184px;
	height: 40px;
	background: #f55;
	border-radius: 3px;
	text-align: center;
	font-size: 14px;
	font-family: PingFangSC;
	font-weight: 500;
	color: #fff;
	line-height: 40px
}

.open-alert-mask .alert-container .pointOut[data-v-2a3350d2] {
	margin-top: 10px;
	margin-left: 90px;
	font-size: 14px;
	font-family: PingFangSC;
	font-weight: 400;
	color: #6d6f73
}

.header[data-v-2a3350d2] {
	background-color: #fff;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 10;
	width: 100%;
	height: 77px;
	display: flex;
	justify-content: center
}

.header .center[data-v-2a3350d2] {
	width: 1258px;
	display: flex;
	justify-content: space-between
}

.header .center-photo[data-v-2a3350d2] {
	position: relative;
	/* margin-top: 15px; */
	top: 20px;
	width: 214px;
	height: 44px;
	background-image:
		url(images/index/n_v27bb206fc39c1458cb874704d07325074.png);
	background-repeat: no-repeat;
	background-size: cover
}

.header .center-btn[data-v-2a3350d2] {
	display: flex;
	flex-direction: row;
	margin-top: 18px
}

.header .center-btn .user[data-v-2a3350d2] {
	margin-left: 56px;
	display: flex;
	flex-direction: row
}

.header .center-btn .user .pic[data-v-2a3350d2] {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background-size: cover;
	background-repeat: no-repeat
}

.header .center-btn .user .nickname[data-v-2a3350d2] {
	margin-left: 8px;
	margin-top: 10px;
	font-size: 14px;
	font-family: PingFangSC;
	font-weight: 400;
	color: #3c3c3c;
	line-height: 20px
}

.header .center-btn .btn[data-v-2a3350d2] {
	margin-top: 10px;
	margin-left: 56px;
	font-size: 14px;
	font-family: PingFangSC-Regular;
	font-weight: 400;
	color: #545252
}

.header .center-btn .btn .qrCode[data-v-2a3350d2] {
	z-index: 11;
	margin-top: 2px;
	margin-left: -50px;
	position: fixed;
	width: 156px;
	height: 163px;
	background-image:
		url(images/index/n_v293b2e815c2984fe783f25f2db373f508.png)
		<a href="www.baidu.com"/>
}

.header .center-btn .chart[data-v-2a3350d2] {
	margin-left: 48px;
	margin-top: -2px;
	width: 120px;
	height: 42px;
	background-image:
		url(images/index/n_v23d69a804576e48f2adc41dde0a12504e.png)
}

.header .center-btn .chart .shoppingNum[data-v-2a3350d2] {
	width: 18px;
	height: 18px;
	background: #f55;
	border: 1px solid #fff;
	font-size: 10px;
	border-radius: 50%;
	text-align: center;
	margin-top: 4px;
	margin-left: 35px;
	font-family: PingFangSC;
	font-weight: 600;
	color: #fff;
	line-height: 18px
}

.tab-frame[data-v-46a488cf] {
	min-width: 1258px;
	display: flex;
	justify-content: center;
	margin-top: 10px
}

.tab-frame .tab-bar[data-v-46a488cf] {
	background-color: #fff;
	min-width: 1258px;
	display: flex;
	flex-direction: row
}

.tab-frame .tab-bar .tab-item[data-v-46a488cf] {
	margin-left: 30px
}

.tab-frame .tab-bar .tab-item .context[data-v-46a488cf] {
	margin-top: 15px;
	margin-bottom: 13px;
	width: 134px;
	text-align: center;
	font-size: 16px;
	font-family: PingFangSC;
	font-weight: 400;
	color: #545252
}

.tab-frame .tab-bar .tab-item .click[data-v-46a488cf] {
	font-weight: 500;
	color: #f55
}

.tab-frame .tab-bar .tab-item .bottom-color[data-v-46a488cf] {
	margin-left: 52px;
	width: 28px;
	height: 4px;
	background: #f85555;
	border-radius: 2px
}

.book-frame[data-v-2efe49be] {
	width: 100%;
	margin-bottom: 77px;
	display: flex;
	justify-content: center;
	margin-top: 10px
}

.book-frame .book-list[data-v-2efe49be] {
	background-color: #fff;
	width: 1226px;
	padding: 0 16px;
	display: flex;
	flex-wrap: wrap
}

.book-frame .book-list .book-item[data-v-2efe49be] {
	margin-top: 24px;
	margin-left: 14px;
	width: 226px;
	height: 403px;
	border: 1px solid #e7e7e7
}

.book-frame .book-list .book-item .photo[data-v-2efe49be] {
	margin-top: 14px;
	margin-left: 14px;
	width: 198px;
	height: 265px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50%
}

.book-frame .book-list .book-item .name[data-v-2efe49be] {
	font-size: 18px;
	font-weight: 500;
	color: #2e3135;
	margin-top: 8px
}

.book-frame .book-list .book-item .author[data-v-2efe49be], .book-frame .book-list .book-item .name[data-v-2efe49be]
	{
	font-family: PingFangSC, sans-serif;
	margin-left: 14px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.book-frame .book-list .book-item .author[data-v-2efe49be] {
	margin-top: 2px;
	font-size: 16px;
	font-weight: 400;
	color: #9b9b9b
}

.book-frame .book-list .book-item .publisher[data-v-2efe49be] {
	margin-top: 4px;
	margin-left: 14px;
	font-size: 16px;
	font-family: PingFangSC, sans-serif;
	font-weight: 400;
	color: #9b9b9b;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.book-frame .book-list .book-item .buy[data-v-2efe49be] {
	display: flex;
	justify-content: space-between
}

.book-frame .book-list .book-item .buy .left[data-v-2efe49be] {
	display: flex;
	flex-direction: row
}

.book-frame .book-list .book-item .buy .left .price[data-v-2efe49be] {
	margin-top: 2px;
	margin-left: 14px;
	font-size: 20px;
	font-family: PingFangSC, sans-serif;
	font-weight: 500;
	color: #f55
}

.book-frame .book-list .book-item .buy .left .price .sign[data-v-2efe49be]
	{
	font-size: 14px
}

.book-frame .book-list .book-item .buy .left .used[data-v-2efe49be] {
	margin-left: 8px;
	margin-top: 10px;
	width: 32px;
	height: 16px;
	background-image:
		url(images/index/n_v20f75a9d0b6764f72a010436277b10919.png);
	background-repeat: no-repeat;
	background-size: cover
}

.book-frame .book-list .book-item .buy .chart[data-v-2efe49be] {
	margin-right: 21px;
	margin-top: 2px;
	width: 30px;
	height: 30px;
	background-image:
		url(images/index/n_v299dba5f778974cb3b5de631552869a9e.png);
	background-repeat: no-repeat;
	background-size: cover
}

.book-frame .list-empty[data-v-2efe49be] {
	background-color: #fff;
	width: 1226px;
	padding: 20px 16px 0;
	height: 70vh;
	color: #545252;
	font-size: 20px;
	text-align: center
}

.bottom[data-v-1f2f31ec] {
	height: 69px;
	width: 100%;
	background-color: #3a457a;
	bottom: 0;
	z-index: 10;
	position: fixed;
	display: flex;
	justify-content: center;
	line-height: 69px;
	font-size: 14px;
	font-family: PingFangSC;
	font-weight: 400;
	color: #fff
}

.bottom .font1[data-v-1f2f31ec] {
	font-family: PingFangSC-Medium
}

.bottom .font2[data-v-1f2f31ec] {
	font-family: PingFangSC-Regular
}

.bottom-filed-wrap[data-v-1f2f31ec] {
	position: relative;
	border-top: 1px solid #d8d8d8;
	background: #fafafa;
	height: 200px;
	overflow: hidden
}

.bottom-filed[data-v-1f2f31ec] {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	margin: 0 auto;
	min-height: 40px
}

.bottom-filed .filed-content[data-v-1f2f31ec] {
	white-space: nowrap;
	font-size: 12px;
	padding-left: 70px;
	background: url(images/index/hetun.png) no-repeat 0;
	background-size: 41px 38px
}

.bottom-filed .filed-content .filed-content-left[data-v-1f2f31ec] {
	vertical-align: middle;
	display: inline-block;
	margin-right: 120px
}

.bottom-filed .filed-content .filed-content-left p[data-v-1f2f31ec] {
	color: #454545;
	line-height: 1.7
}

.bottom-filed .filed-content .filed-content-right[data-v-1f2f31ec] {
	vertical-align: middle;
	display: inline-block
}

.bottom-filed .filed-content .filed-content-right p[data-v-1f2f31ec] {
	color: #454545;
	line-height: 1.7
}

.col-md-6 {
	top: -5px;
}

.col-md-6 .input {
	width: 300px;
}
</style>
<!-- 自定义样式 -->
<style>

/* 河豚图标 */
.center .center-xianyu {
	width: 240px;
	height: 100px;
}

.center .center-xianyu .icon-hetun {
	font-size: 60px;
	color: rgb(228, 7, 7);
}

.center .center-xianyu .hetun {
	font-size: 25px;
	color: rgb(228, 7, 7);
	font-weight: 800;
	display: inline-block;
	position: absolute;
	top: 25px;
}

.login-username {
	color: #F22E00;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.box-footer li {
	display: block;
	float: none;
	color: black;
}

.box-footer {
	position: absolute;
	float: right;
	right: 1%;
	top: 70px;
}

#pageId {
	/* 使分页框始终维持在页面顶层，随滑动而滑动 */
	position: fixed;
}

.col-md-6 {
	width: 450px;
	right: -20px;
}
</style>

</head>

<body data-n-head="">
	<div data-server-rendered="true" id="__nuxt">
		<!---->
		<div id="__layout">
			<div class="main" data-v-fdc68faa>
				<div class="header" data-v-2a3350d2 data-v-fdc68faa>

					<div class="center" data-v-2a3350d2>
						<!-- 图标 -->
						<div class="center-xianyu">
							<i class="iconfont icon-hetun"></i> <span class="hetun">闲渔二手商城</span>
						</div>


						<div class="center-btn" data-v-2a3350d2>
							<!-- 搜索框-->

							<div class="col-md-6">
								<div class="header-search">
									<form>
										<input class="input" placeholder="输入要搜索的商品" name="input">
										<button type="button" class="search-btn">搜索</button>
									</form>
								</div>
							</div>

							<div class="btn" data-v-2a3350d2>
								<a href="myxianyu">我的闲渔</a>
								<div class="qrCode" style="display: none;" data-v-2a3350d2></div>
							</div>
								
							<div class="btn" data-v-2a3350d2>
								<a href="addgoods">出售商品</a>
							</div>
							<div class="btn" data-v-2a3350d2>
								<p shiro:guest="">
									<a class="login-username" href="login">登陆</a> <a  class="register-username"href="register">注册</a></a>
								</p>



								<div class="dropdown">
									<button style="background: white;" id="dLabel" type="button" data-toggle="dropdown"
										aria-haspopup="true" aria-expanded="false">
										<p shiro:user="">
											<a class="login-username"> <shiro:principal
													property="username" />
											</a> <span class="caret"></span>
										</p>

									</button>
									<ul class="dropdown-menu" aria-labelledby="dLabel">
										<button type="button" class="btn btn-default"
											data-dismiss="modal"
											onclick="javascrtpt:window.location.href='http://localhost/login'">切换账号</button>
										<button type="button" class="btn btn-default"
											data-dismiss="modal"
											onclick="javascrtpt:window.location.href='doLogout'">退出登录</button>
									</ul>
								</div>

							</div>
							<div class="chart" data-v-2a3350d2>
							</div>
						</div>
					</div>
					<div data-v-2a3350d2></div>
				</div>

				<!-- 分类栏 -->
				<div class="tab-frame" data-v-46a488cf data-v-fdc68faa>
					<div class="tab-bar" data-v-46a488cf>
						<div class="tab-item" data-v-46a488cf>
							<div class="context click" data-v-46a488cf>
								<a href="#">推荐</a>
							</div>
							<!-- <div class="bottom-color" data-v-46a488cf></div> 这个是显示下划线 -->
						</div>
						<div class="tab-item" data-v-46a488cf>
							<div class="context" data-v-46a488cf>
								<a href="#">二手手机</a>
							</div>
						</div>
						<div class="tab-item" data-v-46a488cf>
							<div class="context" data-v-46a488cf>
								<a href="#">奢侈品</a>
							</div>
						</div>
						<div class="tab-item" data-v-46a488cf>
							<div class="context" data-v-46a488cf>
								<a href="#">二手图书</a>
							</div>
						</div>
						<div class="tab-item" data-v-46a488cf>
							<div class="context" data-v-46a488cf>
								<a href="#">潮品</a>
							</div>
						</div>
						<div class="tab-item" data-v-46a488cf>
							<div class="context" data-v-46a488cf>
								<a href="#">衣服</a>
							</div>
						</div>
						<div class="tab-item" data-v-46a488cf>
							<div class="context" data-v-46a488cf>
								<a href="#">女鞋</a>
							</div>
						</div>
					</div>
				</div>

				<!--商品展示页 -->
				<div class="section">
					<div id="tishi" style="text-align: center;">数据加载中...</div>
					<!-- 客服插件元素 -->
					<div class="container perfect_scrollbar" id="container">
						<div class="pvr_chat_button">
							<i class="material-icons">chat</i> <span>客户服务</span>
						</div>
						<div class="pvr_chat_wrapper">
							<div class="pvr_chat_content">
								<div class="close_chat">
									<i class="material-icons">close</i>
								</div>
								<div class="chat_header">
									<div class="pvr-user-w with-status status-green">
										<div class="pvr-user-avatar-w">
											<div class="user-avatar">
												<img alt="" th:src="@{/assets/img/avatar/default-avatar.png}">
											</div>
										</div>
										<div class="user-name">
											<h6 class="user-title">
												<a target="_blank"> 客服-复读机</a>
											</h6>

										</div>
									</div>
									<div class="chat-messages theme_2">
										<div class="message">
											<div class="message-content">请在下方输入框输入问题描述...</div>
										</div>

										<div class="message">
											<div class="message-contents">
												<a
													href="http://wpa.qq.com/msgrd?v=3&uin=205768886&site=qq&menu=yes"
													target="_blank"> 或单击跳转人工</a>
											</div>
										</div>
									</div>
									<div class="chat-controls">
										<input class="message-input" id="message-input"
											placeholder="输入您的问题描述" type="text">
										<div class="chat-extra">
											<a href="javascript:void(0)"> <span class="extra-tooltip">添加链接
											</span> <i class="material-icons">attach_file</i>
											</a> <a href="javascript:void(0)"> <span
												class="extra-tooltip">添加图片 </span> <i class="material-icons">add_a_photo</i>
											</a>
										</div>
									</div>
								</div>
							</div>
						</div>

				<!-- 分页页面 -->
				<div id="pageId" class="box-footer clearfix"></div>
						<!-- /SECTION -->
						<div class="bottom-filed-wrap" data-v-1f2f31ec data-v-fdc68faa>
							<div class="bottom-filed" data-v-1f2f31ec>
								<div class="filed-content" data-v-1f2f31ec>
									<div class="filed-content-left" data-v-1f2f31ec>
										<p data-v-1f2f31ec>闲渔科技有限责任公司 联系我们 微信服务号：闲渔网</p>
										<p data-v-1f2f31ec>Copyright 2015-2018 zhuanzhuan.com All
											Right Reserved</p>
									</div>
									<div class="filed-content-right" data-v-1f2f31ec>
										<p data-v-1f2f31ec>违法信息举报：jubao@闲渔.com</p>
										<p data-v-1f2f31ec>
											<a target="_blank" href="" data-v-1f2f31ec>
												增值电信业务经营许可证：京B2-20180057 </a> <a target="_blank" href=""
												data-v-1f2f31ec> 京公网安备11010802030669号 </a>
										</p>
										<p data-v-1f2f31ec>
											<a target="_blank" href="http://www.miit.gov.cn/"
												data-v-1f2f31ec> 网站备案/许可证号： 京ICP备17029143号-1 </a>
										</p>
										<p data-v-1f2f31ec>违法不良信息举报电话：（010）83416704</p>
										<p data-v-1f2f31ec>网络食品销售第三方平台提供者备案：京食药网食备201810024号</p>
										<p data-v-1f2f31ec>
											<a href="" target="_blank" data-v-1f2f31ec>出版物经营许可证：新出发京零字第海180144号</a>
										</p>
										<p data-v-1f2f31ec>
											<a href="" target="_blank" data-v-1f2f31ec>广播电视节目制作经营许可证（京）字第1182号</a>
										</p>
										<p data-v-1f2f31ec>
											<a href="" target="_blank" data-v-1f2f31ec>闲渔科技有限责任公司营业执照</a>
										</p>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			
</body>


<script type="text/javascript" src="js/common/bootstrap.min.js"></script>
<script type="text/javascript" src="js/index/slick.min.js"></script>
<script type="text/javascript" src="js/index/nouislider.min.js"></script>
<script type="text/javascript" src="js/index/jquery.zoom.min.js"></script>
<script type="text/javascript" src="js/index/main.js"></script>
<!-- 动态添加商品数据 -->
<script type="text/javascript">
				
	/* 文档就绪，绑定按钮，请求数据 */
	$(function(){
		$(".search-btn").click(findObject);
		//调用jq的load方法
		$("#pageId").load("doPageUI", function() {
			findObject();
		});
		
	});
	/* 请求数据 */
	function findObject(value){
		var params;
		var pageCurrent = $("#pageId").data("pageCurrent");
		if(!pageCurrent){
			params = {"pageCurrent":1};//如果是首次刷新默认为1页
		}else{
			params = {"pageCurrent":pageCurrent};//获取参数
		}
		var content;
		/* debugger; */
		//判断类选择器
/* 		if($(this).prop("class")==".search-btn"){
			console.log($(this).attr("class"));
			 content = $(".header-search .input").val();
		}else{
			console.log($(this).attr("class")+"123");
			content = value;
		} */
		
		content = $(".header-search .input").val();
		if(content)params.content = content;//如果不为空则设置该从参数
		var url="goods/doFindObject";
		$.post(url,params,function(result){
			if(result.state==1){
				console.log(result);
				diplayGoods(result.data.records);//传递商品参数
				doSetPagination(result.data)
			}else{
				$("#tishi").text("数据获取失败，请重试");
			}
			
		});
		//展示商品
		function diplayGoods(data){
			//清除内容
			$("#tishi").empty();
			if(data.length<1){
				console.log(data.length);
				$("#tishi").text("没有商品数据");
			}

			var strs= new Array(); //定义一数组 
			var allGoods="";
			//最多只显示两行
			for(let j=0;j<2;j++){
				//共用标签<!-- Products tab & slick -->
				let commonHeader =  "<div class='container'><div class='col-md-12'><div class='row'><div class='products-tabs'>"
					+"<div id='tab1' class='tab-pane active'><div class='products-slick slick-initialized slick-slider' data-nav='#slick-nav-1'>"
					+"<div class='slick-list draggable'>"
					+"<div class='slick-track '>";
				let commonFooter = "</div></div></div></div></div></div></div>";
				let goods="";
				for(let i=j*4;i<data.length ;i++){
					
					strs=data[i].imgUrl.split(";"); //字符分割 ,分割图片地址
					<!-- product -->
					 goods +=	
								"<div class='product slick-slide '  style='width: 290px;'><div class='product-img'>"
								+"<img src="+strs[0]+" >"
								+"<div class='product-label'><span class='sale'>-30%</span> <span class='new'>NEW</span></div>"
								+"</div>"
								+"<div class='product-body'><h3 class='product-name'>"
								+"<a style='font-size:20px;' href='/Shop/doFindShopsObjectById?commodityId="+data[i].id+"' target='_blank'>"+data[i].content+"</a></h3>"
								+"<h4 style='display:inline-block;margin-top:5px;' class='product-price'>$"+data[i].price+"</h4>"
								+"<div class='product-rating'><i class='fa fa-star'></i><i class='fa fa-star'></i><i class='fa fa-star'></i><i class='fa fa-star'></i><i class='fa fa-star'></i></div>"
								+"<div class='product-btns'><button class='add-to-wishlist'><i class='fa fa-heart-o'></i>"
								+"<span class='tooltipp'>收藏</span></button></div></div>"
								+"<div class='add-to-cart'><button class='add-to-cart-btn'><i class='fa fa-shopping-cart'></i>加入购物车</button></div>"
								+"</div>";
					if((i+1)%4==0)break;
				}
				if(goods!=""){
					allGoods=commonHeader+goods+commonFooter;
					goods="";
					
				}//有数据才会添加
				//有数据才会添加
				if(allGoods!=""){
					$("#tishi").append(allGoods);//往container添加页面
					allGoods="";
				}
						
			}
			
			
		}
		
	}
</script>
</html>